<template>
  <div class="remove-sub-tab">
    <scroll-bar :slot-name-list="slotNameList">
      <template #partA>
        <content-remove-form />
      </template>
      <template #partB>
        <transform-name-form />
      </template>
      <template #partC>
        <suffix-file-name-form v-if="flag === 'file'" />
      </template>
    </scroll-bar>
  </div>
</template>

<script lang="ts" setup>
import ContentRemoveForm from './Form/ContentRemoveForm.vue'
import TransformNameForm from './Form/TransformNameForm.vue'
import SuffixFileNameForm from './Form/SuffixFileNameForm.vue'
import ScrollBar from '@renderer/components/ScrollBar/index.vue'
import { computed } from 'vue'

const props = defineProps<{
  // 文件 / 目录标志
  flag: 'file' | 'folder'
}>()

const slotNameList = computed(() => {
  if (props.flag === 'file') {
    return ['partA', 'partB', 'partC']
  } else {
    return ['partA', 'partB']
  }
})
</script>

<style lang="less" scoped></style>
